<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html >
<head>
    <meta charset="UTF-8">
    <title>可自由切换的注册登录表单模板</title>
    <link href='https://fonts.googleapis.com/css?family=Titillium+Web:400,300,600' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/normalize.min.css">


    <link rel="stylesheet" href="css/style.css">


</head>

<body>

<div class="form">

    <ul class="tab-group">
        <li class="tab active"><a href="#signup">Sign Up</a></li>
        <li class="tab"><a href="#login">Log In</a></li>
    </ul>

    <div class="tab-content">
        <div id="signup">
            <h1>Sign Up for Free</h1>

            <form action="/register" method="post">

                <div class="field-wrap">
                    <label>
                        用户名<span class="req">*</span>
                    </label>
                    <input name="userName" type="text"required autocomplete="off"/>
                </div>

                <div class="field-wrap">
                    <label>
                        邮箱<span class="req">*</span>
                    </label>
                    <input name="email" type="email"required autocomplete="off"/>
                </div>

                <div class="field-wrap">
                    <label>
                        密码<span class="req">*</span>
                    </label>
                    <input name="password" type="password"required autocomplete="off"/>
                </div>
                <p class="forgot" style="color: red;">${error}</p>
                <button type="submit" class="button button-block"/>Get Started</button>

            </form>

        </div>

        <div id="login">
            <h1>Welcome Back!</h1>

            <form action="/login" method="post">

                <div class="field-wrap">
                    <label>
                        用户名<span class="req">*</span>
                    </label>
                    <input name="userName" type="text"required autocomplete="off"/>
                </div>

                <div class="field-wrap">
                    <label>
                        密码<span class="req">*</span>
                    </label>
                    <input name="password" type="password"required autocomplete="off"/>
                </div>
                <p class="forgot" style="color: red;">${error}</p>
                <button class="button button-block"/>Log In</button>

            </form>

        </div>

    </div><!-- tab-content -->

</div> <!-- /form -->
<script src='js/jquery.min.js'></script>

<script  src="js/index.js"></script>

</body>
</html>
